<template>
	<view class="login">
		<div class="container">
			<h1>LOGO</h1>
			<form @submit="formSubmit">
				<view>
					<image src="/static/组 39.png" mode="widthFix"></image><input type="text" placeholder="请输入账号"
						name="loginname" v-model="user.loginname">
				</view>
				<view>
					<image src="/static/形状 6.png" mode="widthFix"></image><input password type="text"
						placeholder="请输入密码" name="password" v-model="user.password">
				</view>
				<button form-type="submit">登录</button>
			</form>
		</div>
	</view>
</template>

<script setup>
	import {
		ref
	} from 'vue';
	import Http from "../../utils/request.js"
	import {
		useUserStore
	} from "../../store/userStore.js"

	const userStore = useUserStore();
	let user = ref({
		loginname: "",
		password: "",
	})

	async function formSubmit(e) {
		var formdata = e.detail.value;
		if (user.value.password === "" || user.value.loginname === "") return uni.showToast({
			title: "用户名或密码不能为空",
			icon: "error"
		});
		try {
			let result = await Http.post("/api/user/login", formdata)
			if (result.code !== "200") return uni.showToast({
				title: result.message,
				icon: "error"
			});
			uni.showToast({
				title: result.message,
			});
			// uni.setStorageSync("token", result.data.token);
			// uni.setStorageSync("userid", result.data.userid);
			userStore.userid=result.data.userid;
			userStore.token=result.data.token;
			uni.switchTab({
				url: "/pages/index/index"
			})
		} catch (err) {}
	}
</script>

<style scoped>
	.login {
		display: flex;
		align-items: center;
		justify-content: center;
		height: 100vh;
	}

	h1 {
		color: #94CF39;
		font-size: 76rpx;
		text-align: center;
		margin-bottom: 140rpx;
	}

	form {}

	form view {
		display: flex;
		align-items: center;
		background-color: #F9F9FB;
		border-radius: 100rpx;
		padding: 20rpx 40rpx;
		margin-bottom: 30rpx;
	}

	form view image {
		width: 30rpx;
		margin-right: 20rpx;
	}

	form button {
		background-color: #94CF39;
		color: #fff;
		font-size: 28rpx;
		margin-top: 60rpx;
		border-radius: 100rpx;
	}
</style>